<template>
  <div>
    <div>{{ $store.state.counta }}</div>
    <button @click="addCount">+1</button>
    <div>{{ $store.state.counta }}</div>
    <button @click="addCount(100)">+100</button>
    <div>{{ $store.getters.more20 }}</div>
    <div>{{ $store.getters.more20s }}</div>
    <button @click="getAsyncCount">文字+123</button>
    <div>{{ $store.state.count }}</div>
  </div>
</template>

<script>
import { mapMutations } from "vuex";
import { mapActions } from "vuex";
export default {
  methods: {
    ...mapMutations(["addCount"]),
    addCount() {
      //20是实参
      //addCount 这个是方法
      this.$store.commit("addCount", 20);
    },
    //简写的辅助函数，
    // ...mapMutations(["addCount"]),
    ...mapActions(["getAsyncCount"]),
  },
};
</script>

<style>
</style>